<template>
	<view class="info">
		<block v-if="!boxHide">
			<view class="user_item">
				<view>{{info.r_user_name}}</view>
				<view class="user_item_icon">
					<image src="/static/images/return_icon1.png"  @tap="makePhone(info.mobile)"></image>
					<!-- <image src="/static/images/return_icon2.png"></image> -->
				</view>
			</view>
			
			<view class="return_list" style="margin-top:20rpx;">
					<view class="order_item">
						<view class="order_item_title">
							<view class="order_item_title_text">
								<view>{{info.customer_address}}</view>
								<view>{{info.customer_name}}/{{info.customer_title}}</view>
							</view>
							<image src="/static/images/table.png" @tap="toOrderInfo(info.id)"></image>
						</view>
						
						<block v-for="(item,index) in info.product_list">
							<view class="order_item_num" :key="index">
								<view>{{item.product_name}}</view>
								<view>数量{{item.number}}</view>
							</view>
						</block>
						
						<view class="order_item_content">
							<view class="font_item">
								<view>收货地址</view><view>{{info.customer_address}}</view>
							</view>
							<view class="font_item">
								<view>订单编号</view><view>{{info.order_no}}</view>
							</view>
							<view class="font_item">
								<view>开单日期</view><view>{{info.create_at}}</view>
							</view>
							<view class="font_item">
								<view>成交日期</view><view>{{info.close_ats?info.close_ats:''}}</view>
							</view>
							<view class="font_item">
								<view>收款期限</view><view>{{info.sk_date?info.sk_date:''}}</view>
							</view>
							<view class="font_item">
								<view>交货期限</view><view>{{info.jh_date}}</view>
							</view>
							<view class="font_item">
								<view>订单进度</view>
								<view>{{info.schedule == null ? "-" : info.schedule}}</view>
								<!-- <view class="font_item_picker">
									<picker mode="selector" :range="type" @change="">
										<view>{{typeIndex == -1 ? '请选择' : type[typeIndex]}}</view>
									</picker>
								</view> -->
							</view>
							<view class="font_item">
								<view>审核工单</view><view>{{info.r_content}}</view>
							</view>
							<view class="order_item_price">
								<text>¥</text><text>{{info.total_price}}</text><text>意向（{{info.is_pay == 0 ? '未收' : '已收'}}）</text>
							</view>
						</view>
					</view>
			</view>
			
			<view class="order_title">审批进度</view>
			<view class="info_item" v-if="info.r_approval_status==0">
				<view class="info_item_laber">
					<view style="color:gray;">暂未审批</view>
					<image  src="/static/images/laber_icon1.png"></image>
				</view>
				<view class="info_item_content">
					<view class="info_item_user">
						<image :src="info.r_approval_avatar"></image>
						<view>{{info.r_approval_name}}</view>
						<view class="info_item_user_time"></view>
					</view>
				</view>
			</view>
			
			<view class="info_item" v-if="info.r_approval_status==1">
				<view class="info_item_laber">
					<view>同意</view>
					<image src="/static/images/laber_icon2.png"></image>
				</view>
				<view class="info_item_content">
					<view class="info_item_user">
						<image :src="info.r_approval_avatar"></image>
						<view>{{info.r_approval_name}}</view>
						<view class="info_item_user_time">{{info.r_approval_time}}</view>
					</view>
					<view class="info_item_remark">{{info.r_approval_desc}}</view>
				</view>
			</view>

			<view class="info_item" v-if="info.r_approval_status==2">
				<view class="info_item_laber">
					<view style="color:#d81e06;">拒绝</view>
					<image src="/static/images/laber_icon3.png"></image>
				</view>
				<view class="info_item_content">
					<view class="info_item_user">
						<image :src="info.r_approval_avatar"></image>
						<view>{{info.r_approval_name}}</view>
						<view class="info_item_user_time">{{info.r_approval_time}}</view>
					</view>
					<view class="info_item_remark">{{info.r_approval_desc}}</view>
				</view>
			</view>

			<view class="save" @tap="approver(info,1)" v-if="info.r_approval_status==0 && isApproval==1 ">审批</view>

			<block v-if="info.r_approval_status==1">
				<view class="order_title">审核进度</view>

				<view class="info_item" v-if="info.r_status==0">
					<view class="info_item_laber">
						<view style="color:gray;">暂未审核</view>
						<image  src="/static/images/laber_icon1.png"></image>
					</view>
					<view class="info_item_content">
						<view class="info_item_user">
							<image :src="info.r_audit_avatar"></image>
							<view>{{info.r_audit_name}}</view>
							<view class="info_item_user_time"></view>
						</view>
					</view>
				</view>

				<view class="info_item" v-if="info.r_status==1">
					<view class="info_item_laber">
						<view>同意</view>
						<image src="/static/images/laber_icon2.png"></image>
					</view>
					<view class="info_item_content">
						<view class="info_item_user">
							<image :src="info.r_audit_avatar"></image>
							<view>{{info.r_audit_name}}</view>
							<view class="info_item_user_time">{{info.r_audit_time}}</view>
						</view>
						<view class="info_item_remark">{{info.r_desc}}</view>
					</view>
				</view>

				<view class="info_item" v-if="info.r_status==2">
					<view class="info_item_laber">
						<view style="color:#d81e06;">拒绝</view>
						<image src="/static/images/laber_icon3.png"></image>
					</view>
					<view class="info_item_content">
						<view class="info_item_user">
							<image :src="info.r_audit_avatar"></image>
							<view>{{info.r_audit_name}}</view>
							<view class="info_item_user_time">{{info.r_audit_time}}</view>
						</view>
						<view class="info_item_remark">{{info.r_desc}}</view>
					</view>
				</view>

				<view class="save" @tap="approver(info,2)" v-if="info.r_approval_status == 1 && info.r_status==0 && item.r_audit_id == userId  && isAudit==1 ">审核</view>

			</block>
			
		</block>
		<Loading ref="load"></Loading>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				boxHide:false,
				info:{},
				userId:"",
				isAudit: -1, // 审核权限：1.审核  -1.没权限
				isApproval:-1 // 审批权限：1.审批 -1.没权限
			}
		},
		onLoad(options) {
			this.userId = uni.getStorageSync("userId")
			this.isAudit = this.$app.globalData.isAudit;
			this.isApproval =  this.$app.globalData.isApproval;

			this.$refs.load.initLoading({loadType:1}).then(res =>{
				this.boxHide = false;
				this.$api.getReturnInfo({id:options.id}).then(res =>{
					this.info = res;
					this.$refs.load.getLoadingData({})
				})
			})
		},
		methods:{
			makePhone(phoneNumber) {
				uni.makePhoneCall({
					phoneNumber
				})
			},
			approver(item,type){
				uni.navigateTo({
					url:"/pages/return/approve/approve?id=" + item.r_id + "&order_id=" + item.id+"&type="+type
				})
			}, 
			toOrderInfo(id){
				uni.navigateTo({
					url:"/pages/order/info/info?id="+id
				})
			}
		}
	}
</script>

<style>
	.info{padding-bottom: 120upx;}
	.user_item{background: #FFFFFF;}
	.info_item{width: 100%;padding: 0 30upx;display: flex;flex-direction: row;box-sizing: border-box;margin: 20upx 0;}
	.info_item_laber{width: 170upx;height: 44upx; display: flex;flex-direction: row;align-items: center;font-size: 28upx;color: #049BFF;padding-top: 20upx;justify-content: space-between;margin-right: 20upx;}
	.info_item_laber image{width: 44upx;height: 44upx;}
	.info_item_content{width: 490upx;background: #FFFFFF;padding:20upx 30upx;}
	.info_item_user{display: flex;flex-direction: row;align-items: center;font-size: 28upx;color: #333333;}
	.info_item_user image{width: 58upx;height: 58upx;border-radius: 50%;margin-right: 20upx;background: #EEEEEE;}
	.info_item_user_time{font-size: 24upx;color: #999999;margin-left: auto;}
	.info_item_remark{font-size: 28upx;margin-top: #333333;margin-top: 20upx;}
</style>
